<template>
	<view class="info-sex" :style="'height:'+ screenHeight +'px !important;'">
		<uni-nav-bar color="#ffffff" background-color="#007AFF" :status-bar="true" left-icon="arrowleft" title="性别设置"  right-text="保存" @clickLeft="back" @clickRight="savejob"/>
		<view v-for="(value,index) in sex" :key="index" @tap="sexcheck(index)">
			<view class="info-sex-block" hover-class="info-sex-click" >
				<text>{{value}}</text>
				<uni-icons type="checkmarkempty" size="25" color="#4eec00" v-show="okdisplay==index"/>
			</view>
			<view class="info-sex-divider"></view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				okdisplay:0,
				sex:{0:"男",1:"女"},
				screenHeight: '',	
			}
		},
		onLoad() {
		     this.screenHeight = uni.getSystemInfoSync().windowHeight;
		},
		methods: {
			sexcheck(index){
				this.okdisplay=index;
			},
			back(){
				uni.navigateTo({
					url:"./user/info"
				})
			},
		}
	}
</script>

<style scoped lang="less">
	@import url("../../../static/fontSize.less");
	@import url("../../../static/color.less");
	.info-sex{
		width: 100%;
		height: 100%;
		background-color:@colorLightGray;
	}
	.info-sex-block{
		background-color: @colorWrite;
		display: flex;
		justify-content: space-between;
	}
	.info-sex-divider{
		background-color:@colorLightGray;
		height: 2rpx;
	}
	.info-sex-block text{
		margin: 5rpx 30rpx;
		font-size: @fontBigger;
		padding: 25rpx;
	}
	.info-sex-click{
		background-color:@colorLightGray;
	}
	.sex-btn{
		margin-top: 10rpx;
	}
</style>
